@charset "utf-8";
/* CSS Document */
*{margin:0px; padding:0px; outline:none;-webkit-tap-highlight-color: rgba(0, 0, 0, 0.5);}
body{margin:0 auto;font-size:12px; height: 100%; overflow: hidden; background:#333; background-size: 100% 100%;}
li{list-style:none;}
img{border:none;}
html{ overflow: hidden; height: 100%;overflow-y:hidden;-webkit-text-size-adjust: 100%;-webkit-tap-highlight-color: rgba(0, 0, 0, 0.5);}
.wrap{ width:100%; min-width:320px; max-width:640px; margin:0 auto; position: relative; height: 100%; overflow: hidden;}
.clear{clear:both;}
.clearfix{zoom:1;}
.clearfix:after{content:'';clear:both;display:block;height:0;visibility:hidden;}
a{color:#666; outline:none;}
a, a:visited{text-decoration:none;}

//d点赞
.position_zhan{position: absolute; right: 10px;  bottom: 40px; width: 35px; height :35px; z-index: 100;}
.foot_zhan{  width: 35px; height: 35px; z-index: 100;}
.foot_zhan:active{ width:41px; height: 41px; margin-top: -3px; margin-left: -3px;}

.position_zhan{position: absolute; right: 10px;  bottom: 40px; width: 35px; height :35px; z-index: 100;}
.foot_zhan{  width: 35px; height: 35px; z-index: 100;}
.foot_zhan:active{ width:41px; height: 41px; margin-top: -3px; margin-left: -3px;}

.parentImg{ width: 23px; height: 23px; display:inline-block; position:absolute;top:-5px; left: 6px; animation: vertical-animation 1.4s linear forwards; -webkit-animation: vertical-animation 1.4s linear  forwards;}
@-webkit-keyframes vertical-animation {
  0% { transform: translateY(0px);  opacity: 1}
  100% { transform: translateY(-100px);  opacity: 0}
}

.parentImg0 img, .parentImg1 img{ width: 25px; height: 25px; display:inline-block;
  animation: hor-animation 1.4s linear forwards;
  -webkit-animation: hor-animation 1.4s linear forwards;  }
@-webkit-keyframes hor-animation {
  0% { transform: translateX(0px); transform: scale(0);}
  10%{ transform: scale(1);}
  25% { transform: translateX(5px); }
  50%{transform: translateX(0px); }
  75%{transform: translateX(-5px); }
  100% { transform: translateX(0px);}
}

.parentImg2 img,.parentImg3 img{ width: 21px; height: 21px;
  animation: hor-animation1 1.4s linear forwards;
  -webkit-animation: hor-animation1 1.4s linear forwards;  }
@-webkit-keyframes hor-animation1 {
  0% { transform: translateX(0px);  transform: scale(0);}
  10%{ transform: scale(1);}
  33% { transform: translateX(10px);}
  66%{transform: translateX(5px);}
  100% { transform: translateX(0px);}
}

.parentImg4 img,.parentImg5 img{ width: 21px; height: 21px;
  animation: hor-animation2 1.4s linear forwards;
  -webkit-animation: hor-animation2 1.4s linear forwards;  }
@-webkit-keyframes hor-animation2 {
  0% { transform: translateX(0px);  transform: scale(0);}
  10%{ transform: scale(1);}
  33% { transform: translateX(-10px);}
  66%{transform: translateX(-5px); }
  100% { transform: translateX(3px); }
}

.parentImg6 img,.parentImg7 img{ width: 23px; height: 23px;
  animation: hor-animation3 1.2s linear forwards;
  -webkit-animation: hor-animation3 1.2s linear forwards;  }

@-webkit-keyframes hor-animation3 {
  0% { transform: translateX(0px);  transform: scale(0);}
  10%{ transform: scale(1);}
  33% { transform: translateX(10px);}
  66%{transform: translateX(5px); }
  100% { transform: translateX(0px); }
}

.parentImg8 img,.parentImg9 img{width: 25px; height: 25px;
  animation: hor-animation4 1.2s linear forwards;
  -webkit-animation: hor-animation4 1.2s linear forwards;  }

@-webkit-keyframes hor-animation4 {
  0% { transform: translateX(0px);  transform: scale(0);}
  10%{ transform: scale(1);}
  33% { transform: translateX(-5px);}
  66%{transform: translateX(-10px); }
  100% { transform: translateX(-6px); }
}

.portrait .candou{-webkit-animation: shakerotate 1s  ease-in-out; animation:shakerotate 0.6s  ease-in-out;  }
@-webkit-keyframes shakerotate {
  0% {  -webkit-transform: translate(0px, 0px) scaleX(1) scaleY(1);  }
  56% {  -webkit-transform: translate(0px, 0px) scaleX(1.3) scaleY(1.1);  }
  100% {  -webkit-transform: translate(0px, 0px) scaleX(1) scaleY(1);  }
}
.landscape .candou{-webkit-animation: shakerotate2 1s  ease-in-out; animation:shakerotate2 0.6s  ease-in-out;  }
@-webkit-keyframes shakerotate2 {
  0% {  -webkit-transform: translate(0px, 0px)  }
  56% {  -webkit-transform: translate(10px, 0px)  }
  100% {  -webkit-transform: translate(0px, 0px) }
}